<%--管理员-博客管理列表--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="utf-8">
    <title>图形图像处理交流网站</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/admin/lib/layui-v2.5.5/css/layui.css" media="all">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/admin/css/public.css" media="all">
</head>
<body>
<div class="layuimini-container">
    <div class="layuimini-main">

        <%--搜索相关--%>
        <fieldset class="table-search-fieldset">
            <legend>搜索信息</legend>
            <div style="margin: 10px 10px 10px 10px">
                    <div class="layui-form-item layui-form layui-form-pane demoTable">
                        <div class="layui-inline">
                            <label class="layui-form-label">时间区间</label>
                            <div class="layui-input-inline">
                                <input type="text" class="layui-input" id="startTime" placeholder="起始时间" autocomplete="off" >
                            </div>
                            <div class="layui-input-inline">
                                <input type="text" class="layui-input" id="endTime" placeholder="结束时间" autocomplete="off">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">标题/作者</label>
                            <div class="layui-input-inline">
                                <input class="layui-input" name="id" placeholder="标题/用户" id="demoReload" onfocus="this.placeholder=''" onblur="this.placeholder='标题/用户'" autocomplete="off">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <button class="layui-btn layui-btn-primary"  data-type="reload" id="search" lay-filter="data-search-btn"><i class="layui-icon"></i> 搜 索</button>
                        </div>
                    </div>
            </div>
        </fieldset>

        <%--表格相关--%>
        <table class="layui-hide" id="test" lay-filter="test"></table>
        <script type="text/html" id="barDemo">
            <a class="layui-btn layui-btn-primary layui-btn-xs" target="_blank" lay-event="detail">查看</a>
            <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
            <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
        </script>

    </div>
</div>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-3.3.1.js" ></script>
<script src="${pageContext.request.contextPath}/admin/lib/layui-v2.5.5/layui.js" charset="utf-8"></script>

<%--表格渲染--%>
<script>
    layui.use('table', function(){
        var table = layui.table;

        table.render({
            elem: '#test'
            ,url:'${pageContext.request.contextPath}/admin/blog/admin_list.do'
            ,toolbar: 'default' //开启头部工具栏，并为其绑定左侧模板
            ,defaultToolbar: ['filter', 'exports', 'print', { //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
                title: '提示'
                ,layEvent: 'LAYTABLE_TIPS'
                ,icon: 'layui-icon-tips'
            }]
            , id: 'test'
            ,title: '博客管理表'
            ,cols: [[
                { fixed: 'left',type: 'checkbox',width:'5%'}
                ,{field:'bId', title:'ID',type:"numbers", width:'5%', unresize: true, align:'center'}
                ,{field:'bTitle', title:'标题', width:'15%', sort: true, align:'center',edit:'true'}
                ,{field:'tId', title:'博客类型', width:'15%', sort: true, align:'center',templet: '<div>{{d.type.tName}}</div>'}
                ,{field:'bCreateTime', title:'写作日期', width:'16%', sort: true, align:'center'}
                ,{field:'bUpdateTime', title:'修改日期', width:'16%', sort: true, align:'center',templet:function(d){
                        if(d.bUpdateTime!=null){
                            return d.bUpdateTime;
                        }else{
                            return '未修改';
                        }
                    }}
                ,{field:'uId', title:'作者', width:'10%', sort: true, align:'center',templet: '<div>{{d.user.userName}}</div>'}
                ,{title:'操作', toolbar: '#barDemo', width:'18%', align:'center'}
            ]]
            ,page: true,
            text: {
                none: '暂无相关数据'
            }
        });
        //数据表格重载
        // 执行搜索，表格重载
        var $ = layui.$,active={
            reload:function(){
                var demoReload = $('#demoReload').val();
                var startTime = $('#startTime').val();
                var endTime = $('#endTime').val();
               // console.log('demoReload='+demoReload+'startTime='+startTime+'endTime='+endTime);
                table.reload('test', {
                    method: 'get'
                    , where: {
                        'keywords': demoReload
                        ,'startTime':startTime
                        ,'endTime':endTime
                        ,'time':new Date().valueOf()
                    }
                    , page: {
                        curr: 1
                    }
                });
            }
        }
        /*$('#search').on('click', function () {
            // 搜索条件
            var demoReload = $('#demoReload').val();
            var startTime = $('#startTime').val();
            var endTime = $('#endTime').val();
            console.log('demoReload='+demoReload+'startTime='+startTime+'endTime='+endTime);
            table.reload('test', {
                method: 'get'
                , where: {
                    'keywords': demoReload
                    ,'startTime':startTime
                    ,'endTime':endTime
                }
                , page: {
                    curr: 1
                }
            });
        });*/

        $('.demoTable .layui-btn').on('click', function(){
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });

        //监听头工具栏事件
        table.on('toolbar(test)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id)
                ,data = checkStatus.data; //获取选中的数据
            switch(obj.event){
                case 'add':
                    var index = layer.open({
                        title: '添加博客',
                        type: 2,
                        shade: 0.2,
                        maxmin:true,
                        shadeClose: true,
                        area: ['100%', '100%'],
                        content: '${pageContext.request.contextPath}/admin/blog/to_add.do',
                    });
                    $(window).on("resize", function () {
                        layer.full(index);
                    });

                    break;
                case 'update':
                    if(data.length === 0){
                        layer.msg('请选择一行');
                    } else if(data.length > 1){
                        layer.msg('只能同时编辑一个');
                    } else {
                        var index = layer.open({
                            title: '编辑博客',
                            type: 2,
                            shade: 0.2,
                            maxmin:true,
                            shadeClose: true,
                            area: ['100%', '100%'],
                            content: '${pageContext.request.contextPath}/admin/blog/to_edit.do?bId='+data[0].bId,
                        });
                        $(window).on("resize", function () {
                            layer.full(index);
                        });
                    }
                    break;
                case 'delete':
                    if(data.length === 0){
                        layer.msg('请选择一行');
                    } else {
                        var ids = [];//id
                        var bTitle = [];//name
                        for (var i = 0; i < data.length; i++) { //循环筛选出id
                            ids.push(data[i].bId);
                            bTitle.push(data[i].bTitle);
                        }
                        //发送删除请求
                        layer.confirm("确认要删除"+JSON.stringify(bTitle)+"吗，删除后不能恢复", { title: "删除确认" }, function(index){
                            senddel(ids);
                            return false;
                        });
                    }
                    break;
            };
        });

        //监听行工具事件
        table.on('tool(test)', function(obj){
            var data = obj.data;
            //console.log(data.uId);
            if(obj.event === 'del'){
                layer.confirm('真的删除行么', function(index){
                    var ids = data.bId;
                    senddel(ids);
                    return false;
                });
            }else if(obj.event === 'detail'){//查看
                window.open("${pageContext.request.contextPath}/blog/content.do?bId="+data.bId);
            }else if(obj.event === 'edit'){
                var index = layer.open({
                    title: '编辑博客',
                    type: 2,
                    shade: 0.2,
                    maxmin:true,
                    shadeClose: true,
                    area: ['100%', '100%'],
                    content: '${pageContext.request.contextPath}/admin/blog/to_edit.do?bId='+data.bId,
                });
                $(window).on("resize", function () {
                    layer.full(index);
                });
            }
        });
        /*监听单元格编辑*/
        table.on('edit(test)', function(obj){
            var value = obj.value //得到修改后的值
                ,data = obj.data //得到所在行所有键值
                ,field = obj.field; //得到字段
            table_edit_update(data.bId,field,value);
        });

        /*删除请求*/
        function senddel(ids){
            $.ajax({
                url: "${pageContext.request.contextPath}/admin/blog/admin_delete.do",
                type: "post",
                data: 'ids='+ids,
                success: function (result) {
                    if (result.msg == 200) {
                        //关闭弹框
                        //layer.close(index);
                        layer.msg("删除成功", {icon: 6});
                        table.reload('test',{});
                    } else {
                        layer.msg("删除失败", {icon: 5});
                    }
                }
            });
        };

        //编辑单元格发送请求
        function table_edit_update(bId,field,value){
            $.post('${pageContext.request.contextPath}/admin/blog/admin_update.do?'+field+'='+value,{bId:bId},function(result){
                if(result.code==0){
                    layer.msg(result.msg);
                }else{
                    layer.closeAll();
                    layer.msg(result.msg);
                }
            },'json');

        }

    });
    /*选择时间*/
    layui.use('laydate', function() {
        var laydate = layui.laydate;
        laydate.render({
            elem: '#startTime'
            , theme: 'molv'
        });
        laydate.render({
            elem: '#endTime'
            , theme: 'molv'
        });
    });

</script>

</body>
</html>
